<!-- 驾驶员基本信息 -->
<!DOCTYPE>
<html>

<head>
    <%- include ../taglib/layout-table.ejs %>


</head>

<body class="gray-bg">
<div class="wrapper wrapper-content animated fadeInRight">
    <div class="row">
        <div class="col-sm-12">
            <div class="ibox float-e-margins ">
                <div class="ibox-title">
                    <h5>查询条件</h5>
                    <div class="ibox-tools">
                        <a class="collapse-link">
                            <i class="fa fa-chevron-up"></i>
                        </a>
                    </div>
                </div>
                <div class="ibox-content">
                    <div class="row">
                        <div class="pull-right">
                            <form role="form" class="form-inline ">

                                <!--<div class="form-group">-->
                                    <!--<label class="control-label">时间范围：</label>-->
                                <!--</div>-->
                                <!--<div class="form-group">-->
                                    <!--<input placeholder="开始时间" class="laydate-icon form-control layer-date" id="start">-->
                                <!--</div>-->
                                <!--<div class="form-group">-->
                                    <!--<input placeholder="结束时间" class="laydate-icon form-control layer-date" id="end">-->
                                <!--</div>-->
                                <div class="input-group div-serch-input">
                                    <input type="text" placeholder="请录入名称查询" class="input form-control" id="serchStr">
                                    <span class="input-group-btn">
                                        <button type="button" class="btn btn btn-primary" onclick="query()"> <i class="fa fa-search"></i> 搜索</button>
                                    </span>
                                </div>
                            </form>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="row">
        <div class="col-sm-3">
            <div class="ibox float-e-margins ">
                <div class="ibox-title">
                    <h5>选择客户</h5>
                    <div class="ibox-tools">
                        <a class="collapse-link">
                            <i class="fa fa-chevron-up"></i>
                        </a>
                    </div>
                </div>
                <div class="ibox-content  pre-scrollable">
                    <div id='external-events'>
                        <ul id="kindTree" class="ztree">
                        </ul>
                    </div>
                </div>
            </div>

        </div>
        <div class="col-sm-9">
            <div class="ibox float-e-margins">
                <div class="ibox-title">
                    <h5>数据列表</h5>
                    <div class="ibox-tools">
                    </div>
                </div>
                <div class="ibox-content">
                    <div class="" id="">
                        <button class="btn btn-primary " type="button"  onclick="add()"><i class="fa fa-check"></i>&nbsp;新增</button>
                        <button class="btn btn-danger " type="button" onclick="dels()"><i class="fa fa-close"></i> 批量删除</button>
                        <div>
                            <table id="example"
                                   class="table table-striped table-bordered table-hover dataTables-example">
                                <thead>
                                <tr>
                                    <th>
                                    </th>
                                    <th width="200px">id</th>
                                    <th width="200px">deptId</th>
                                    <th width="200px">姓名</th>
                                    <th width="200px">所属用户</th>
                                    <th width="200px">性别</th>
                                    <th width="200px">出生日期</th>
                                    <th width="200px">工号</th>
                                    <th width="200px">联系电话</th>
                                    <th width="200px">办公电话</th>
                                    <th width="200px">家庭住址</th>
                                    <th width="200px">参加工作时间</th>
                                    <!--<th width="200px">图片地址</th>-->
                                    <th width="200px">从业资格证号</th>

                                    <th width="200px" class="show-detail-json">操作</th>
                                </tr>
                                </thead>
                                <tbody>
                                </tbody>
                            </table>

                        </div>
                        <div class="modal inmodal" id="myModal"  role="dialog" data-width="500px"
                             data-height="400px" aria-hidden="true">
                            <div class="modal-dialog">
                                <div class="modal-content animated bounceInRight">
                                    <div class="modal-header">
                                        <h4 class="modal-title">驾驶员基本信息</h4>
                                    </div>
                                    <div class="modal-body" style="max-height: 400px; ">

                                        <form class="form-horizontal m-t" id="editForm"  method="get" >
                                            <input id="id" name="id" type="hidden">
                                            <input id="deptId" name="deptId" type="hidden">

                                            <div class="form-group">
                                                <label class="col-sm-3 control-label">姓名</label>
                                                <div class="col-sm-8">
                                                    <input id="baseDriverName" name="baseDriverName"
                                                           class="form-control" placeholder="姓名必填" type="text"
                                                           aria-required="true" aria-invalid="true">
                                                </div>
                                            </div>
                                            <div class="form-group">
                                                <label class="col-sm-3 control-label">性别</label>
                                                <div class="col-sm-8">
                                                    <select class="form-control m-b" id="baseDirverSex"
                                                            name="baseDirverSex" type="text">
                                                        <option value="男">男</option>
                                                        <option value="女">女</option>
                                                    </select>
                                                </div>
                                            </div>

                                            <div class="form-group">
                                                <label class="col-sm-3 control-label">工号</label>
                                                <div class="col-sm-8">
                                                    <input id="baseDriverNo" name="baseDriverNo" class="form-control"
                                                           type="text"
                                                           >
                                                </div>
                                            </div>
                                            <div class="form-group">
                                                <label class="col-sm-3 control-label">联系电话</label>
                                                <div class="col-sm-8">
                                                    <input id="baseDriverPhone" name="baseDriverPhone"
                                                           class="form-control" type="text"
                                                           >
                                                    <!--可以增加提示-->
                                                    <!--<span class="help-block m-b-none"><i class="fa fa-info-circle"></i> 这里写点提示的内容</span>-->
                                                </div>
                                            </div>
                                            <div class="form-group">
                                                <label class="col-sm-3 control-label">办公电话</label>
                                                <div class="col-sm-8">
                                                    <input id="baseDriverWorkPhone" name="baseDriverWorkPhone"
                                                           class="form-control"  type="text"
                                                          >
                                                    <!--可以增加提示-->
                                                    <!--<span class="help-block m-b-none"><i class="fa fa-info-circle"></i> 这里写点提示的内容</span>-->
                                                </div>
                                            </div>
                                            <div class="form-group">
                                                <label class="col-sm-3 control-label">家庭住址</label>
                                                <div class="col-sm-8">
                                                    <input id="baseDriverHome" name="baseDriverHome"
                                                           class="form-control"  type="text"
                                                          >
                                                    <!--可以增加提示-->
                                                    <!--<span class="help-block m-b-none"><i class="fa fa-info-circle"></i> 这里写点提示的内容</span>-->
                                                </div>
                                            </div>
                                            <div class="form-group">
                                                <label class="col-sm-3 control-label">出生日期</label>
                                                <div class="col-sm-8">
                                                    <input placeholder="出生日期" type="text"
                                                           class="laydate-icon form-control layer-date"
                                                           name="baseDriverBirth" id="start">
                                                </div>
                                            </div>
                                            <div class="form-group">
                                                <label class="col-sm-3 control-label">参加工作时间</label>
                                                <div class="col-sm-8">
                                                    <input placeholder="参加工作时间" type="text"
                                                           class="laydate-icon form-control layer-date"
                                                           name="baseDriverCjWork" id="end">

                                                    <!--可以增加提示-->
                                                    <!--<span class="help-block m-b-none"><i class="fa fa-info-circle"></i> 这里写点提示的内容</span>-->
                                                </div>
                                            </div>
                                            <div class="form-group hide">
                                                <label class="col-sm-3 control-label">图片地址</label>
                                                <div class="col-sm-8">
                                                    <input id="baseDriverPicture" name="baseDriverPicture"
                                                           class="form-control"  type="text">
                                                    <!--可以增加提示-->
                                                    <!--<span class="help-block m-b-none"><i class="fa fa-info-circle"></i> 这里写点提示的内容</span>-->
                                                </div>
                                            </div>
                                            <div class="form-group">
                                                <label class="col-sm-3 control-label">从业资格证号</label>
                                                <div class="col-sm-8">
                                                    <input id="baseDriverZgNo" name="baseDriverZgNo"
                                                           class="form-control"  type="text">
                                                </div>
                                            </div>

                                        </form>
                                    </div>
                                    <div class="modal-footer">
                                        <button type="button" class="btn btn-white" onclick="closeModal()" >关闭</button>
                                        <button type="button" class="btn btn-primary" onclick="save()">保存</button>
                                    </div>
                                </div>
                            </div>
                        </div>

                    </div>
                </div>
            </div>
        </div>

    </div>
</div>

    <%- include ../taglib/layout-content.ejs %>


    <script type="text/javascript">
        var table;
        var validator ;
        $(document).ready(function () {
            table= $('.dataTables-example').dataTable({
                "lengthChange": false,//是否允许用户自定义显示数量
//            "searching": false,//本地搜索
//            "scrollY": "220px",//dt高度
            "scrollX": true,//dt高度
            "autoWidth": true,//自动宽度
                "dom": '<"top"<"clear">>rt<"bottom"ilp<"clear">>',
//            "lengthChange": false,//是否允许用户自定义显示数量
                "ajax": {
                    "url": "/baseDriver/list",
                    "dataSrc": "rows"
                },
                serverSide: true,
                columns: [
                    {
                        "sClass": "text-center",
                        "data": "id",
                        'checkboxes': {
                            'selectRow': true,
                        }
                    },
                    {"sClass": "text-center", data: 'id'},
                    {"sClass": "text-center", data: 'deptId'},
                    {"sClass": "text-center", data: 'baseDriverName', "bSortable": false, "orderable": false},
                    {"sClass": "text-center", data: 'deptName', "bSortable": false, "orderable": false},
                    {"sClass": "text-center", data: 'baseDirverSex', "bSortable": false, "orderable": false},
                    {"sClass": "text-center", data: 'baseDriverBirth', "bSortable": false, "orderable": false},
                    {"sClass": "text-center", data: 'baseDriverNo', "bSortable": false, "orderable": false},
                    {"sClass": "text-center", data: 'baseDriverPhone', "bSortable": false, "orderable": false},
                    {"sClass": "text-center", data: 'baseDriverWorkPhone', "bSortable": false, "orderable": false},
                    {"sClass": "text-center", data: 'baseDriverHome', "bSortable": false, "orderable": false},
                    {"sClass": "text-center", data: 'baseDriverCjWork', "bSortable": false, "orderable": false},
//                    {"sClass": "text-center", data: 'baseDriverPicture', "bSortable": false, "orderable": false},
                    {"sClass": "text-center", data: 'baseDriverZgNo', "bSortable": false, "orderable": false},
                    {
                        "bSortable": false,//禁止排序
                        "orderable": false,
                        "sClass": "text-center",
                        data: function (d,e,f,g) {//这里给最后一列返回一个操作列表
                            //e是得到的json数组中的一个item ，可以用于控制标签的属性。
                            var id=d.id
                            var index=g.row
                            return '' +
                                '<button class="btn btn-info btn-sm btn-select-row" type="button" onclick="edit('+index+')" data-toggle="modal"   ><i class="fa fa-edit"></i> <span class="bold">编辑</span>' +
                                '<button class="btn btn-danger btn-sm btn-select-row" type="button"  onclick="del('+id+')" ><i class="fa fa-close"></i> <span class="bold">删除</span>';

                        }
                    }
                ],
                //排序
                'order': [[1, 'desc']],
                initComplete: function (setting, json) {
                    //隐藏列
                    visiblecolumn(1,false)
                    visiblecolumn(2,false)
                },
            });

            //验证
            var cusrules={
                rules: {
                   baseDriverName: {
                    required :true,
                    //minlength: 3,
                    //maxlength: 20
                }
                },
                messages: {
                   baseDriverName: {
                    required: icon + "请输入姓名",
                    //minlength: icon + "姓名必须3个字符以上",
                    //maxlength: icon + "姓名必须20个字符以下"
                }
                }

            };
            validator=$("#editForm").validate(cusrules);
            //日期范围限制
            var start = {
                elem: '#start',
                format: 'YYYY-MM-DD',
//                min: laydate.now(), //设定最小日期为当前日期
                max: '2999-06-16 23:59:59', //最大日期
//            start: laydate.now(),
//            start: laydate.now() + ' 00:00:00',
                istime: true,
                istoday: false,
                festival: true, //是否显示节日
                choose: function (datas) {
                    end.min = datas; //开始日选好后，重置结束日的最小日期
                    end.start = datas //将结束日的初始值设定为开始日
                }
//            min: laydate.now(-1), //-1代表昨天，-2代表前天，以此类推
//            max: laydate.now(+1) //+1代表明天，+2代表后天，以此类推
            };
            var end = {
                elem: '#end',
                format: 'YYYY-MM-DD',
//            min: laydate.now(),
                max: '2999-06-16 23:59:59',
//            start: laydate.now() + ' 23:59:59',
                istime: true,
                istoday: false,
                festival: true, //是否显示节日
                choose: function (datas) {
//                    start.max = datas; //结束日选好后，重置开始日的最大日期
                }
            };
            laydate(start);
            laydate(end);
        $("#start").val(laydate.now()+ ' 00:00:00');
        $("#end").val(laydate.now()+ ' 23:59:59');
//        下拉列表
            $("#myModal").on("shown.bs.modal", function(){
////            静态数据或者从后台获取动态数据 此处为comb的id和数据数据ajax获取
                //loadComb("baseCarNoColour",combColor);

            })

        });
        //数字框
        (function ($) {
            $('.spinner .btn:first-of-type').on('click', function() {
                var num=parseInt($('.spinner input').val(), 10);
                if(num<9){
                $('.spinner input').val( parseInt($('.spinner input').val(), 10) + 1);
                }

            });
        $('.spinner .btn:last-of-type').on('click', function() {
                var num=parseInt($('.spinner input').val(), 10);
//            if(!num){
//                num=0;
//            }
                if(num>1){
                $('.spinner input').val( parseInt($('.spinner input').val(), 10) - 1);
                }


            });
        })(jQuery);
        function add() {
            var selectedNode = tree_Obj.getSelectedNodes()[0];
            debugger;
            if (selectedNode.isParent) {
                swal("选择错误", "此客户无法添加驾驶员!", "warning");
                return false;
            } else {
                $.ajax({
                    type: "GET",
                    url: "/baseDriver/create",
                    cache: false,
                    async: false,
                    dataType: "json",
                    success: function (data) {

                        $('#editForm').loadDate(data);
                        $("#myModal").modal("show");
                    }
                });

            }
            }

        function edit(index) {
            var data=table.DataTable().rows(index).data()
            if(data && data[0]){
                //loadComb("baseCarNoColour",combColor);
//            $('#editForm').resetForm();
            $('#editForm').loadDate(data[0]);
            $("#myModal").modal("show");
            }else {
                swal("已取消", "数据错误！", "warning");
            }
        }
        function del(id) {
            swal({
                    title: "您确定要删除这条信息吗",
                    text: "删除后将无法恢复，请谨慎操作！",
                    type: "warning",
                    showCancelButton: true,
                    confirmButtonColor: "#DD6B55",
                    confirmButtonText: "是的，我要删除！",
                    cancelButtonText: "让我再考虑一下…",
                    closeOnConfirm: false,
                    closeOnCancel: false
                },
                function (isConfirm) {
                    if (isConfirm) {
                    $.ajax({
                            type: "GET",
                            url: "/baseDriver/del",
                            cache: false,
                            async: false,
                            data:{
                                ids:id
                            },
                            dataType: "json",
                            success: function (data) {
//                            swal("删除成功！", "您已经永久删除了这条信息。", "success");
                                swal("删除成功！", data, "success");
                                query();
                            }
                        });

                    } else {
                        swal("已取消", "您取消了删除操作！", "error");
                    }
                });
        }
        function dels() {

            var rows=table.DataTable().rows('.selected').data();
            if(rows && rows.length>=1){

                var ids="";
                rows.each(function (value) {
                    ids+=value.id+",";
                })
                debugger;
                del(ids);
            }else {
                swal("系统提示", "请选择需要删除的数据！", "warning");
            }

        }
        function query() {
            var code=$("#serchStr").val();
            var carIds=$("#h_all_car_id").val();
            var jsonstr="";
            if(carIds){
                jsonstr = [{"deptid": carIds},{"code": code}];
            }else {
                jsonstr = [{"deptid": "0,"},{"code": code}];
            }
            table.DataTable().search(JSON.stringify(jsonstr),false,false).draw();
        }
        function save() {
            var selectedNode = tree_Obj.getSelectedNodes()[0];
            $("#deptId").val(selectedNode.id);
        $('#editForm').ajaxSubmit({
                type: 'post', // 提交方式 get/post
                dataType:'json',
                url: '/baseDriver/save', // 需要提交的 url
                beforeSubmit: function (formData, jqForm, options) {
                    if(!$("#editForm").valid()){
                        return false;
                    }
                },
                success: function(data) {
                    // data 保存提交后返回的数据，一般为 json 数据
                    // 此处可对 data 作相关处理
                    if(data.success){
                        swal({
                            title: "系统提示",
                            text: data.msg,
                            type: "success"
                        });
                    $("#myModal").setDefForm(validator);
                   $('#editForm').clearForm(true);
                    $("#myModal").modal("hide");
                        query();
                    }else{
                        swal({
                            title: "系统提示",
                            text: data.msg,
                            type: "error"
                        });
                    }
                },

            });
        }
        function closeModal() {
        $("#myModal").setDefForm(validator);
        $("#myModal").modal("hide");
        }
        //隐藏和显示列 c:列0开始，visible=false隐藏
        function visiblecolumn(c,visible) {
            table.DataTable().column(c).visible(visible)
        }
        function loadComb(id,data) {
        $("#"+id).select2({
                data: data,
                theme: "bootstrap",
                placeholder:'请选择',
                allowClear:true
            });
        }
    </script>
<script>
    $(function () {
        var url = '/tree/dept';
//        var listurl="<g:createLink base=".." controller="baseTerminal" action="list"  />";
        var listurl = "";
        init_tree('id', 'parentId', 'name',  fnClick,fnCheck, "checkbox");
        loadMyTree(url);

    });

    //    树节点选中
//    var fnClick = function (event, treeId, treeNode) {
//
//        query();
//
//    }
    var fnClick = function (event, treeId, treeNode) {
        var flag=treeNode.checked;
        tree_Obj.checkNode(treeNode, true, true);
        selectTreeNode(treeNode);


    }
    var fnCheck = function (event, treeId, treeNode, clickFlag) {
//        var flag=treeNode.checked;
//        tree_Obj.checkNode(treeNode, !flag, true);
        var ids=selectTreeNode(treeNode);

    }

    function selectTreeNode(treeNode) {
        debugger;
        var ids = setAllCarIds();
        query(1);
        return ids;
    }
    function setAllCarIds() {
        var checkNodes = tree_Obj.getCheckedNodes(true);
        debugger
        var ids = "";
        $.each(checkNodes, function (key, value) {

//            var flag = value.isParent
//            if (flag && flag==false) {
            ids = ids + value.id + ","
//                carno=value.name;
//            }
        });
        $("#h_all_car_id").val(ids);
        return ids;
    }
</script>
<input type="hidden" id="h_all_car_id" name="carIds">

</body>

</html>
